<template>
  <div>
    <a-modal v-model:visible="visible" title="分享图片" :footer="false" @cancel="closeModel">
      <h4>复制分享连接</h4>
      <a-typography-link copyable>{{ link }}</a-typography-link>
      <div style="margin-bottom: 16px"></div>
      <h4>手机扫码查看</h4>
      <a-qrcode :value="link" size="200" :icon-size="50" />
    </a-modal>
  </div>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
const open = ref<boolean>(false)
const visible = ref<boolean>(false)
interface Props {
  title: string
  link: string
}
const props = withDefaults(defineProps<Props>(), {
  title: '分享图片',
  link: 'www.baidu.com',
})
// 打开弹窗
function openModel() {
  visible.value = true
}
// 关闭弹窗
const closeModel = () => {
  visible.value = false
}
defineExpose({ openModel })
</script>

